body 
{
    touch-action: none;
    margin: 0px 0px 0px 0px;
    font-family: 'Segoe UI', sans-serif;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
}

#content {
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 50px;
    right: 0px;
    z-index: 0;
    background-color: darkgrey;
}

#hitPlane
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.drawSurface
{
    touch-action: none; /* Disable touch behaviors, like pan and zoom */
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.selectable {
    z-index: 1;
}

// Embedded documents
.collab-document {
    background-color: white;
    position: relative;
}

.canvas-chrome {
    background-color: dimgray;
    position: absolute;
    z-index: 11;
    padding: 5px;
}

.banner {
    color: blue;
}

@import "./stickyNote.less";

.navbar-shared-text {
    background-color: #F1F1F1;
    min-height: unset;

    ul {
        padding: 5px 15px;

        @media (min-width: 768px) {
            padding: 5px 0px;
        }        

        &.list-inline {
            margin-bottom: 0px; 
        }
    }
}

.navbar-fluid {
    background-color: #222;
}

.btn-flat {
    border: none;
    background-color: inherit;
    width: 100%;
    height: 100%;
}

.btn-palette {
    border-radius: 0;
    background-color: #333;
    width: 50px;
    height: 50px;
    padding: 5px;
    border: none;
}

.btn-palette:hover {
   background-color: orangered;
}

.blinking {
    animation:blinkrecipe 1s linear 15;
}

.brieflyBlinking {
    animation:blinkrecipe 1s linear 2;
}

@keyframes blinkrecipe{
    50%{    opacity: 0.0; }
}

.fluid-icon {
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: center center;
}

.fluid-icon-pencil {
    .fluid-icon;
    background-image: url("../../images/icons/pencil.svg");
}

.fluid-icon-replay {
    .fluid-icon;
    background-image: url("../../images/icons/backward.svg");
}

.fluid-icon-tube {
    .fluid-icon;
    background-image: url("../../images/icons/test-tube.svg");
}

.fluid-icon-pyramid {
    .fluid-icon;
    background-image: url("../../images/icons/pyramid.svg");
}

.dropdown-menu > li > a.color-choice {
    width: 100%;
    height: 50px;
    
    &:hover, &:focus {
        background-color: inherit;
        background-image: inherit;
    }
}

.dropdown-menu-fluid {
    padding: 0 0;
}

.navbar-nav.navbar-palette {
    margin: 0;

    > li {
        float: left;
    }
}

.typing-details {
    margin-top: 25px;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@import "./login.less";

.status-bar {
    ul {
        padding-left: 0px;
        display: inline-block;
        list-style: none;

        li {
            display: inline-block;
            margin-left: 5px;
        }
    }
}

.title-bar {
    display: inline-block;
    padding-top: 6px;
}

.graph-canvas {
    padding-left: 0;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 800px;
}

#parent-canvas {
    width:100%;
    height:1200px;
    overflow:auto;
}

.links line {
    stroke: #999;
    stroke-opacity: 0.6;
}
  
.nodes circle {
    stroke: #fff;
    stroke-width: 1.5px;
}

.slider {
    display: inline !important;
    width: 5% !important;
    // -webkit-appearance: none;  /* Override default CSS styles *`/
    // appearance: none;
    // width: 50px; /* Full-width */
    // height: 25px; /* Specified height */
    // background: #d3d3d3; /* Grey background */
    // outline: none; /* Remove outline */
    // opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
    // -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    // transition: opacity .2s;
}

.component-link {
    opacity: 0;
    &:hover {
        opacity: 1;
    }
}
